<!DOCTYPE html>
<html>
<script src="../resources/ahem.js"></script>
<style>
* { font-size: 16px; }
svg, rect, div { font-family: 'Ahem'; }
</style>
<html>
<svg id="svg" width="0" height="0"></svg>
<script src="../resources/js-test.js"></script>
<script>
description("Test ex unit with Ahem font");

function computedStyleDiv(property, value) {
    var div = document.createElement("div");
    document.body.appendChild(div);
    div.style[property] = value;
    var computedValue = getComputedStyle(div).getPropertyValue(property);
    document.body.removeChild(div);
    return computedValue;
}

function computedStyleRect(property, value) {
    var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
    document.getElementById("svg").appendChild(rect);
    rect.setAttribute(property, value);
    var computedValue = getComputedStyle(rect).getPropertyValue(property);
    document.getElementById("svg").removeChild(rect);
    return computedValue;
}


function testComputed(property, value, expected) {
	var tolerance = 0.05;
    shouldBeCloseTo('parseFloat(computedStyleDiv("' + property + '", "' + value + '"))', expected, tolerance);
    shouldBeCloseTo('parseFloat(computedStyleRect("' + property + '", "' + value + '"))', expected, tolerance);
}

testComputed("word-spacing", "1ex", 12.8);
</script>
</body>
</html>
